<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>so8 文件系统</title>
<style type="text/css">
<!--
/*tr:hover{ background-color:#CCFFCC}*/
/*a:link {color: #0033CC; text-decoration:none} */    /* 未访问的链接 */
/*a:visited {color: #0033CC; text-decoration:none}*/  /* 已访问的链接 */
/*a:hover {color: #FF00FF; text-decoration:underline}*/    /* 当有鼠标悬停在链接上 */
/*a:active {color: #0000FF} */  /* 被选择的链接 */

.header{ border-top:#CCCCCC solid 25px; border-bottom:#666666 solid 2px; padding-top:25px;}
#title{ font-family:"Times New Roman", Times, serif; font-size:36px;font-weight:bold; width:300px; }
body{margin:0; text-align:center; font:Verdana, Arial, Helvetica, sans-serif; font-size:14px;}
#name{font-size:36px; color:#339999;font-family:'Times New Roman', Times, serif; font-weight:bold; }
#topmenu {
margin-top:2px;
position:relative;
padding:0;
width:100%;
background-color:#006699;
margin-bottom:0;
}
#topmenu>ul{
        list-style-type: none;
        margin:0;
        padding: 0;
}
#topmenu>ul>li{
		float:left;
		padding:0 0px;	
		border-right:#FFFFFF 1px solid;
			text-align:center;
		 }

#topmenu ul>li>a{
 		width:100px;
		display:block;
		text-decoration:none;
		color:#CCCCCC;	
		}
#topmenu li a:hover{
		color:#666666;
		padding:0;
		background-color:#ff9933; 
		}
#submenu{
	background-color:#ff9933;
	width:auto;
	float:left;
	position:absolute;
}
#submenu ul{ margin:0; padding:0;list-style:none;}
#submenu li{}
#submenu li a{ display:block; text-decoration:none; color:#FFFFFF; width:100px; border:#ffffff solid 1px; border-collapse:collapse}		
#submenu li a:hover{ background-color:#006666;}		
.show{ display:block;
}
-->
</style>
<script  type="text/javascript">

// hasClass
function hasClass(ele,cls)
{
	return ele.className.match(new RegExp('(\\s|^)'+cls+'(\\s|$)'));

}
function removeClass(ele,cls)
{
	if(hasClass(ele,cls))
		{
		var reg = new RegExp('(\\s|^)'+cls+'(\\s|$)');
			ele.className=ele.className.replace(reg,'');
		}
}
function addClass(ele,cls)
{
	if(!hasClass(ele,cls))
		ele.className+=" "+cls;
}
function setDivPos(A)
{
var newleft = A.offsetLeft;
var oDiv = document.getElementById('submenu');
oDiv.style.left = newleft + 'px';

}



</script>
</head>

<body>

<div style="width:960px; margin:0 auto">
<div class="header" >
<table width="960"  cellpadding="0" cellspacing="0">
  <tr>
<td width="323"><span id="name">Document Sharing</span></td>
<td width="635" style="text-align:right; vertical-align:center;">
<form>
<input style="width:200px; height:25px; color:#333333; font:'Times New Roman', Times, serif; font-size:18px;margin-right:10px;" type="text" name="key" value=""/>
<input style="background:#999999; color:#FFFFFF; border-bottom:#0099FF solid 1px; margin-right:30px; vertical-align:bottom " type="button" value="search"/></form>
</td>
 </tr></table>
</div>
<div  id="topmenu" ><ul ><li id="1"><a href="#">ALL </a></li><li id="2" ><a href="#">SO8 ></a></li><li id="3"><a href="#">TSSOP ></a></li><li  id="4"><a href="#">DIPS ></a></li></ul><span>&nbsp;</span></div>
<div id="submenu">
  <ul><li><a href="#">quality</a></li><li><a href="#">product</a></li><li><a href="#">report</a></li></ul></div>
</div>
<div style="text-align:left" >
<ul >
<li id="ok">
apple
<ul  id="h1" style="display:none"><li>a</li><li>b</li><li>c</li></ul>
</li>
<li>pear</li>
<li>banana</li>
</ul>
</div>
<script type="text/javascript">
 var oo = document.getElementById('h1');
oo.style.display = 'block';


//tt.onmouseout=removeClass(oo,'test');
/* var ol = oo.childNodes ; 

 for(var i=0; i<ol.length;i++)
 	{	//document.write(ol[i].hasChild);
		document.write(ol[i].nodeName+":");
		if(ol[i].childNodes.length>=0)
		document.write('has'+ol[i].childNodes.length+'children \n');
	}
	*/
 
</script>
</body>
</html>
